import {AfterViewInit, Component, OnInit, TemplateRef, ViewChild} from '@angular/core';
import {DrawerService, IDrawerOpenResult} from "ng-devui";
import {IUserInfo, IImgBlock, isPhone, ILoginResult, LOCAL_LOGIN, DEFAULT_USER} from "../../common/common";
import {Router} from "@angular/router";

@Component({
  selector: 'app-page-main',
  templateUrl: './page-main.component.html',
  styleUrls: ['./page-main.component.scss']
})
export class PageMainComponent implements OnInit, AfterViewInit {

  @ViewChild('drawerContent', {static: true}) drawerContent ?: TemplateRef<any>;
  results: IDrawerOpenResult;

  userInfo!: IUserInfo;

  data!: IImgBlock[];

  collapsed = true;

  disabledBarSize = '2px';

  userLogin = false;

  private token ?: string

  constructor(private router: Router, private drawerService: DrawerService) {
    if (!isPhone()) {
      router.navigateByUrl("bad").then(r => {
        console.log(r);
      })
    }
    this.results = this.openDrawerInstance()
    this.closeDrawer(undefined)
    this.userLogin = false
    this.userInfo = DEFAULT_USER
  }

  ngOnInit(): void {
    //TODO 数据来源
    let dataJson = "[\n" +
      "    {\n" +
      "        \"liked\":true,\n" +
      "        \"collected\":false,\n" +
      "        \"likeCount\":12,\n" +
      "        \"collectCount\":6,\n" +
      "        \"commentCount\":8,\n" +
      "        \"imgSrc\":\"assets/img/yuzu1.jfif\",\n" +
      "        \"title\":\"感谢大家的支持\",\n" +
      "        \"userName\":\"羽生结弦\",\n" +
      "        \"sortText\":\"这段时间的努力没有白费,谢谢各位.在今后的比赛中我会再接再厉!\",\n" +
      "        \"headImg\":\"assets/img/yuzu_head.jfif\"\n" +
      "    },{\n" +
      "        \"liked\":false,\n" +
      "        \"collected\":false,\n" +
      "        \"likeCount\":12,\n" +
      "        \"collectCount\":6,\n" +
      "        \"commentCount\":3,\n" +
      "        \"imgSrc\":\"\",\n" +
      "        \"title\":\"欢迎使用\",\n" +
      "        \"userName\":\"开发者\",\n" +
      "        \"sortText\":\"祝玩的开心!有任何想法可以留言~\",\n" +
      "        \"headImg\":\"\"\n" +
      "    }\n" +
      "]";
    this.data = JSON.parse(dataJson)

    this.historyLocalLogin()
  }

  ngAfterViewInit() {
    this.openDrawerInstance();
  }

  //本地缓存登录
  historyLocalLogin() {
    let item = localStorage.getItem(LOCAL_LOGIN);
    if (item != undefined) {
      let lr: ILoginResult = JSON.parse(item);
      this.afterLoginMethod(lr)
    }
  }

  //登录后的方法
  afterLoginMethod(lr: ILoginResult) {
    if (lr.success && lr.userInfo != null && lr.token != null) {
      this.userInfo = lr.userInfo
      this.userLogin = true
      this.token = lr.token
    }
  }

  logout() {
    this.userLogin = false
    this.userInfo = DEFAULT_USER
    this.token = undefined
    localStorage.removeItem(LOCAL_LOGIN)
  }

  openDrawer(event: Event | undefined) {
    this.results = this.openDrawerInstance()
  }

  //打开侧栏
  openDrawerInstance(): IDrawerOpenResult {
    return this.drawerService.open({
      width: '80%',
      zIndex: 1000,
      isCover: true,
      fullScreen: true,
      backdropCloseable: true,
      escKeyCloseable: true,
      position: 'left',
      onClose: () => {

      },
      contentTemplate: this.drawerContent
    });
  }

  //关闭测栏
  closeDrawer(event: Event | undefined) {
    this.results.drawerInstance.hide();
  }

}
